<div class="right-main" >
    <div nz-row nzType="flex">
        <div nz-col [nzSpan]="4">
            <i class="anticon anticon-environment"></i>
        </div>
        <div nz-col [nzSpan]="20">
            位置信息
        </div>
    </div>
    <div nz-row nzType="flex">
        <div nz-col [nzSpan]="4">

        </div>
        <div nz-col [nzSpan]="20">
            <label [appMargin]="5" >X</label>
            <nz-input-number #color style="width: 50%"  appMargin [bottom]="5" name="color1" [(ngModel)]="rightStyleX"  ></nz-input-number><br />
            <label [appMargin]="5"  >Y</label>
            <nz-input-number #color style="width: 50%;" name="color1" [(ngModel)]="rightStyleY"></nz-input-number>
        </div>
    </div>
    <div nz-row nzType="flex">
        <div nz-col [nzSpan]="4">
            <i class="anticon anticon-arrows-alt"></i>
        </div>
        <div nz-col [nzSpan]="20">
            元件尺寸
        </div>
    </div>
    <div nz-row nzType="flex">
        <div nz-col [nzSpan]="4">

        </div>
        <div nz-col [nzSpan]="20">
            <label [appMargin]="5" >宽</label>
            <nz-input #color style="width: 50%"  appMargin [bottom]="5" name="color1" [(ngModel)]="rightStyleW"></nz-input><br />
            <label [appMargin]="5"  >高</label>
            <nz-input #color style="width: 50%;" name="color1" [(ngModel)]="rightStyleH"></nz-input>
        </div>
    </div>
    <div nz-row nzType="flex">
        <div nz-col [nzSpan]="4">
            <i class="anticon anticon-file-text"></i>
        </div>
        <div nz-col [nzSpan]="20">
            元件内容
        </div>
    </div>
    <div nz-row nzType="flex">
        <div nz-col [nzSpan]="4">

        </div>
        <div nz-col [nzSpan]="20">
            <div *ngIf="uploading" style="padding: 5px 20px">
                <nz-spin></nz-spin>
                上传中...
            </div>
            <button nz-button class="file-upload mt-sm">
                <input id="file1" accept type="file" (change)="fileChange($event)" />
                <i class="anticon anticon-upload"></i><span>上传图片</span>
            </button>
        </div>
    </div>
    <div nz-row nzType="flex">
        <div nz-col [nzSpan]="4">

        </div>
        <div nz-col [nzSpan]="20">
            <button nz-button [nzType]="'primary'" (click)="save()" [disabled]="uploading" class="mr-sm">
                <span>保存</span>
            </button>
            <button nz-button [nzType]="'danger'" (click)="deleteComponent()" [disabled]="uploading" class="mr-sm">
                <span>删除</span>
            </button>
        </div>
    </div>
</div>
